<template>
	<z-paging :refresher-enabled="false" :show-loading-more-when-reload="true" loading-more-default-text=""
		loading-more-loading-text="" loading-more-fail-text="" :empty-view-text="t('common.noData')"
		:show-loading-more-no-more-view="false" ref="paging" v-model="dataList" @query="queryList"
		class="max-w-[750px]">
		<h-dark :title="t('item.titleRecord')"></h-dark>
		<view class="bg-[#2C326B] rounded-lg p-[30rpx] mt-[20rpx] mx-[30rpx]" v-for="item in dataList" :key="item.id">
			<view class="">
				<view class="font-bold mb-[30rpx]">
					{{item.item_title}}
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.money')}}
					</view>
					<view class="">
						{{item.money}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.cycle')}}
					</view>
					<view class="">
						<text class="">{{ item.cycle }}</text>
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{item.rateName}}
					</view>
					<view class="">
						{{item.rate}}%
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.toIncome')}}
					</view>
					<view class="">
						{{item.total_income}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]" v-if="item.point > 0">
					<view class="text-[#00D2E0]">
						{{t('item.point')}}
					</view>
					<view class="">
						{{item.point}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.status')}}
					</view>
					<view class="">
						<view v-if="item.status==2" class="text-success">
							{{tips.finish}}
						</view>
						<view v-if="item.status==1" class="">
							{{tips.pending}}
						</view>
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.contractNo')}}
					</view>
					<view class="text-[#6EA2FF] font-bold underline">
						<navigator hover-class="none" :url="'/pages/item/contract?id='+item.id">
							{{item.contract_no}}
						</navigator>
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.timeInvest')}}
					</view>
					<view class="">
						{{item.create_time}}
					</view>
				</view>
				<view class="flex justify-between mb-[20rpx]">
					<view class="text-[#00D2E0]">
						{{t('item.timeExp')}}
					</view>
					<view class="">
						{{item.end_time}}
					</view>
				</view>
			</view>
		</view>
	</z-paging>
</template>

<script lang="ts" setup>
	import { ref, reactive, shallowRef } from 'vue'
	import { recordLists } from '@/api/item'
	import { getCurrency, getCurrency2,formatMoney } from '@/utils/util'
	import { t } from '@/utils/util'

	uni.setNavigationBarTitle({ title: t('item.titleRecord') })

	//为了提高渲染速度
	const tips = reactive({
		pending: t('tabs.pending'),
		finish: t('tabs.finish'),
		hour: t('item.hour'),
		days: t('item.days'),
		totalRate: t('item.totalRate'),
		dailyRate: t('item.dailyRate'),
		hourRate: t('item.hourRate')
	})

	const paging = shallowRef()
	const dataList = ref<any[]>([])
	const queryList = async (pageNo : number, pageSize : number) => {
		try {
			const data = await recordLists({
				page_no: pageNo,
				page_size: pageSize
			})
			Object.keys(data.lists).forEach(key => {
				data.lists[key]['money'] = getCurrency() + formatMoney(data.lists[key]['money']) + ' ' +  getCurrency2()
				data.lists[key]['total_income'] = getCurrency() + formatMoney(data.lists[key]['total_income']) + ' ' +  getCurrency2()
				var type = data.lists[key]['type'];
				var cycleTime = tips.hour;
				var rateName = tips.totalRate;

				switch (type) {
					case 1:
						cycleTime = tips.days;
						rateName = tips.dailyRate;
						break;
					case 2:
						cycleTime = tips.days;
						break;
					case 3:
						break;
					case 4:
						rateName = tips.hourRate;
						break;
				}
				data.lists[key]['cycle'] = data.lists[key]['cycle'] + ' ' + cycleTime;
				data.lists[key]['rateName'] = rateName;
			})
			paging.value.complete(data.lists)
		} catch (error) {
			paging.value.complete(false)
		}
	}
</script>

<style lang="scss">
</style>